<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<div class="container-fluid">
<div class="row-fluid">
<div class="span2"></div>
<div class="span8">
<div class="row-fluid">
<!-- left side search box container-->
<div class="span6 well" >
<s:form style="text-align: left; margin-left:60px;" theme = "simple" cssClass="form-inline" action="searchadventure" method="post">
<fieldset>
<legend>Search Upcoming Adventures</legend>
<s:label>Location</s:label><br />
    	<s:select list="locations" name="yourlocation"  cssClass="span8"></s:select><br /><br />
<s:label>Type of Adventure</s:label> <br />
    <s:select name="adventuretype" cssClass="span10" 
    list="#{'0':'Trekking/Back Packing/Hiking', '1':'Mountaineering/Rock Climbing'}"></s:select><br /><br />
    <s:submit name="search" theme = "simple" cssClass="btn btn-medium btn-success" value="Search"></s:submit> 
</fieldset>
</s:form>
</div>
    	
<!-- left side search box container ends here -->
<!-- right side image slider container -->

<div  class="span6 well" style="text-align: center">
<br /><br />
<span class="badge badge-important"><h5><s:property value="totalticketssold"/> Tickets Sold!</h5></span>
<br /><br />
<span class="badge badge-warning"><h5><s:property value="totaladventuresorganized"/> Adventures Organized!</h5></span>
<br /><br />
<span class="badge badge-info"><h5><s:property value="totalusers"/> Customers Served!</h5></span>
<br /><br />
</div>
<!-- right side image slider container -->
</div>
</div>
<div class="span2"></div>
</div>
</div>
<hr />
<!-- 1st section starts here -->
<div class="row-fluid">
<div class="span2"></div>
<div class="span8" style="">
<div>
<div id="myCarousel" class="carousel slide">
  <ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
    <li data-target="#myCarousel" data-slide-to="1"></li>
    <li data-target="#myCarousel" data-slide-to="2"></li>
    <li data-target="#myCarousel" data-slide-to="3"></li>
    <li data-target="#myCarousel" data-slide-to="4"></li>
    <!-- <li data-target="#myCarousel" data-slide-to="5"></li>
    <li data-target="#myCarousel" data-slide-to="6"></li>
    <li data-target="#myCarousel" data-slide-to="7"></li>
    <li data-target="#myCarousel" data-slide-to="8"></li>
    <li data-target="#myCarousel" data-slide-to="9"></li>
    <li data-target="#myCarousel" data-slide-to="10"></li> -->
  </ol>
  <!-- Carousel items -->
  <div class="carousel-inner">
    <div class="active item">
    <img src="ViewResource/img/carousel/1.jpg" style="width:100%;height:450px;" alt="">
    <div class="carousel-caption">
                      <h4>Nagalapuram Trek</h4>
                      <p>Talking water never looked so quite like a silent angel with whispers of her wings.</p>
                    </div>
    </div>
    <div class="item">
    <img src="ViewResource/img/carousel/2.jpg" style="width:100%;height:450px;" alt="">
    <div class="carousel-caption">
                      <h4>Walk With Clouds to St. George&#39s Everest</h4>
                      <p>Light Copper bitten ground with mixed flavors of continental climate and warm autumns.</p>
                    </div>
    </div>
    <div class="item">
    <img src="ViewResource/img/carousel/3.jpg" style="width:100%;height:450px;" alt="">
    <div class="carousel-caption">
                      <h4>Tsongmo Lake, Nathula Pass, Indo-China Border</h4>
                      <p>An oval box filled perfectly with blue tranquil color meeting with horizon and the azure sky with vibrant dark blue shades painted over it.</p></div>
    </div>
    <div class="item">
    <img src="ViewResource/img/carousel/4.jpg" style="width:100%;height:450px;" alt="">
    <div class="carousel-caption">
                      <h4>Nishani Motte Trek, Western Ghat</h4>
                      <p>A place where there are no golds but I aver, every path is paved with the gold.</p>
                    </div>
                    </div>
    <div class="item">
    <img src="ViewResource/img/carousel/9.jpg" style="width:100%;height:450px;" alt="">
    <div class="carousel-caption">
                      <h4>Zanskar Valley Trek, Laddakh</h4>
                      <p>When snow flurry hit the lenses.</p>
                    </div>
    </div>
  </div>
  <!-- Carousel nav -->
  <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
  <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
</div>
</div>
</div>
<div class="span2"></div>
</div>
<hr />
<!-- 1st section ends here -->
<!-- 2nd section starts here -->
<div class="row-fluid">
<div class="span2"></div>
<div class="span8">
            <ul class="thumbnails">
              <li class="span4">
                <div class="thumbnail">
                    <img src="ViewResource/img/trekking/trek.jpg" alt="300x200" style="width: 300px; height: 200px;" />
                    <div class="caption">
                    <h3>Trekking</h3>
                    <p>Trek is a long, adventurous journey undertaken on foot in areas where common means of transport are generally not available.
					</p>
                    <p><a href="#" class="btn btn-info">Read More</a> </p>
                  </div>
                </div>
              </li>
              <li class="span4">
                <div class="thumbnail">
                  <img src="ViewResource/img/trekking/scuba.png" alt="300x200" style="width: 300px; height: 200px;" />
                     <div class="caption">
                    <h3>Scuba Driving</h3>
                    <p>A scuba diver usually moves around underwater by using swimfins attached to the feet, but external propulsion can be provided ...
                    <p><a href="#" class="btn btn-info">Read More</a> </p>
                  </div>
                </div>
              </li>
              <li class="span4">
                <div class="thumbnail">
                <img src="ViewResource/img/trekking/mountain.png" alt="300x200" style="width: 300px; height: 200px;" />
                   <div class="caption">
                    <h3>Mountaineering</h3>
                    <p>Mountaineering or mountain climbing is the sport, hobby or profession of hiking, skiing, and climbing mountains .....
                    <p><a href="#" class="btn btn-info">Read More</a></p>
                  </div>
                </div>
              </li>
            </ul>
          </div>
</div>
<!-- 2nd section ends here -->
<hr />
<!-- 3rd section starts here -->
<div class="row-fluid">
<div class="span2"></div>
<div class="span8">
            <div class="row-fluid">
            <div class="span4"><iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fbookyourtrek&amp;width=292&amp;height=395&amp;colorscheme=light&amp;show_faces=false&amp;header=false&amp;stream=true&amp;show_border=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:395px;" allowTransparency="true"></iframe>
            </div>
            <div class="span4">
            <a class="twitter-timeline" href="https://twitter.com/bookyourtrek" data-widget-id="362814238483415042">Tweets by @bookyourtrek</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
            </div>
            <div class="span4">
            <!-- Place this tag where you want the widget to render. -->
<div class="g-page" data-width="292" data-href="//plus.google.com/108381263598567142455" data-rel="publisher"></div>

<!-- Place this tag after the last widget tag. -->
<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>
            </div>
            </div>
          </div>
</div>
<!-- 3rd section ends here -->
<!-- right side bar starts here -->
<div class="span2"></div>

<!-- right side bar ends here -->
